define(function(require, exports, module) {
	/**
	 * <div id="c" class="dictSelector" style="line-height: 21px;">
			<div class="dict-field">
				<input type="text" readonly class="dictSpecCode dict-select" value=""/>
				<div class="dictSpecCodeDiv dropDiv" style="position: absolute;">
				</div>
			</div>	
		</div>
	 */
	function FieldSelect(config) {
		this.fieldSelectId = 'fieldSelector';
		//整个div
		this.$fieldSelect = $('#' + this.fieldSelectId);
		this.$fields=$('.dictSpecCode',this.$fieldSelect);
		//字典个性化的选项容器
		this.$fieldsDiv=$('.dictSpecCodeDiv',this.$fieldSelect);
		this.data=[];//字典数据
		this.selectedArray=[];//name,value
		this.desc="请选择";
		$.extend(this, config);
		this.init();
	}
	FieldSelect.prototype = {
		render:function(){
			this.$fields.val(this.desc);
		},
		dropUp:function(){
			$('.dict-select',this.$fieldSelect).next('.dropDiv').removeClass("show");
		},
		bind : function() {
			var that=this;
			$(this.$fieldsDiv).on('click','ul',function(){
				that.selectedArray=[];
				var $this=$(this);
				$this.toggleClass("selected");
				var $fieldsSelected=$('.selected',that.$fieldsDiv),showFields=[];
				if($fieldsSelected.length>0)
				{
					$.each($fieldsSelected,function(index,ele){
						that.selectedArray.push({name:$(ele).html(),value:$(ele).attr('value')});
						showFields.push($(ele).html());
					});
					that.$fields.val(showFields.join(', '));
					that.$fields.attr('title',showFields.join(', '));
				}
				else
				{
					that.$fields.val(that.desc);
					that.selectedArray=$.map(that.data,function(field){return {name:field.name,value:field.value}});
				}
				that.onChangefields&&that.onChangefields(that.selectedArray);
			});
			$('.dict-select',this.$fieldSelect).on('click',function(){
				$(this).next('.dropDiv').toggleClass("show");
			});
		},
		getData:function(){
			return this.selectedArray;
		},
		setData:function(data){
			this.cleanSelect();	
			this.data=data;
			this.renderSelect(data);
		},
		renderSelect:function(data,selected){
			this.fillSelect(data,selected)
		},
		clean:function(){
			this.cleanSelect();
			this.selectedArray=[];
		},
		cleanSelect:function(){
			this.data=[];
			this.$fields.val(this.desc);
			this.$fieldsDiv.empty();
		},
		/**填充个性下拉框的选项
		 * @param datas 个性化编码选项
		 * @param selecteds 已选中的选项，都好隔开*/
		fillSelect:function(datas,selecteds){
			if(!datas||datas.length==0)
				return;
			
			var selectedFields=[],that=this;
			if(selecteds)
			{
				var valueFields={},showValues=[];
				$.each(this.data,function(index,field){
					valueFields[field.value]=field;
				});
				$.each(selecteds.split(','),function(index,value){
					var field=valueFields[value];
					showValues.push(field.name);
					selectedFields.push(field);
				});
				this.$fields.val(showValues.join(','));
			}	
			else
				selectedFields=this.data;
			
			//selecteds:
			selecteds=[];
			$.each(selectedFields,function(index,field){
				that.selectedArray.push({name:field.name,value:field.value});
				selecteds.push(field.value);
			});
			selecteds=selecteds.join(',');
			
			var htmlStr=[];
			this.data=datas;
			$.each(datas,function(index,ele){
				htmlStr.push('<a><ul value="'+ele.value+'" '
						+(selecteds&&selecteds.indexOf(ele)!=-1?'class="selected"':'')
						+'>'+(ele.name)+'</ul></a>');
			});
			this.$fieldsDiv.append(htmlStr.join(''));
		},
		init:function(){
			this.render();
			this.bind();
			this.setData(this.data);
		}
	};
	return FieldSelect;
});